import React, {Component} from 'react'
import { connect } from 'react-redux'
import { Input, Button } from 'antd'

class Counter extends Component {
    constructor(props) {
        super(props)
    }
    onIncrement() {
        this.props.Increase();
    }
    onDecrement() {
        this.props.Decrease();
    }

    render() {
        return (
            <div>
                <Input type="text" value={this.props.counter.count}/>
                <Button onClick={this.onIncrement.bind(this)}>+</Button>
                <Button onClick={this.onDecrement.bind(this)}>-</Button>
            </div>
        )
    }
}

const mapStateToProps = function (state) {
    return state;
}

const mapDispatchToProps = function(dispatch) {
    return {
        Increase: function() {
            return dispatch({type: "INCREMENT"})
        },
        Decrease: function() {
            return dispatch({type: "DECREMENT"})
        }
    }
}


export default connect(mapStateToProps, mapDispatchToProps)(Counter)